<template xmlns="">
	<div class="layout-padding">
		<el-divider>树形结构demo</el-divider>
		<custom-tree :data="data" @node-click="handleNodeClick" />

		<el-divider>数据表格下拉框</el-divider>
		<MaterialSelect @change="changeMaterial" v-model="material.materialCode" />
		物料代码:{{ material.materialCode }} ,物料名称: {{ material.materialName }}
		<CheckStockHSelect v-model="billCode" :query-params="{ status: 'Checking' }"></CheckStockHSelect>
		<CheckStockHSelect v-model="billCode"></CheckStockHSelect>
    <el-input v-model="material.materialCode"></el-input>{{material.materialCode}}
	</div>
</template>
<script setup lang="ts">
import customTree from '/@/components/CustomTree/index.vue';
import MaterialSelect from '/@/components/mes/select/MaterialSelect.vue';
import CheckStockHSelect from '/@/components/mes/select/CheckStockHSelect.vue';

interface Tree {
	label: string;
	children?: Tree[];
}

const billCode = ref('');

const material = reactive<any>({
	materialCode: '11DCMF01',
});
const changeMaterial = (row) => {
	if (row) {
		material.materialName = row.materialName;
	} else {
		material.materialName = '';
	}
};

const handleNodeClick = (data: Tree) => {
	console.log(data);
};
const data = [
	{
		label: 'Level one 1',
		children: [
			{
				label: 'Level two 1-1',
				children: [
					{
						label: 'Level three 1-1-1',
					},
				],
			},
		],
	},
	{
		label: 'Level one 2',
		children: [
			{
				label: 'Level two 2-1',
				children: [
					{
						label: 'Level three 2-1-1',
					},
				],
			},
			{
				label: 'Level two 2-2',
				children: [
					{
						label: 'Level three 2-2-1',
					},
				],
			},
		],
	},
	{
		label: 'Level one 3',
		children: [
			{
				label: 'Level two 3-1',
				children: [
					{
						label: 'Level three 3-1-1',
					},
				],
			},
			{
				label: 'Level two 3-2',
				children: [
					{
						label: 'Level three 3-2-1',
					},
				],
			},
		],
	},
];
</script>
<style scoped lang="scss"></style>
